<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>

    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1"/>
    <!--兼容性问题-->
    <meta http-equiv="X-UA-COMPATIBLE" content="IE=edge,chrome=1"/>
    <meta name="renderer" content="webkit"/>
    <!--搜索引擎-->
    <meta name="author" content="jerehedu">
    <meta name="keywords" content="bootstrap,css,html">
    <meta name="description" content="jerehedu">

    <style type="text/css"></style>
    <link rel="stylesheet" href="assets/css/reset.css">
    <link rel="stylesheet" href="assets/css/supersized.css">
    <link rel="stylesheet" href="assets/css/style.css">
    <link rel="stylesheet" href="bootstrapfile/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="css/BackToTop_orange.jquery.css" type="text/css" />

    <!--个人css-->
    <link rel="stylesheet" href="css/index.css"/>
</head>
<body>

<header class="bg">
      <div class="bgon">
           <div class="container">
               <div class="col-md-4 pa-photo"><img src="img/women.jpg" alt=""class="img-responsive img-circle"/></div>
               <div class="col-md-8 pa-intruduce page-header"id="top">
                   <h2 class="hello-style">Hello</h2>
                   <h2>我的名字是: &nbsp;宫晨</h2>
               </div>
                 <ul>
                     <li>
                         <ul>
                             <li class="desc1">电话：</li>
                             <li class="desc">18865550155</li>
                         </ul>
                     </li>
                     <li>
                         <ul>
                             <li class="desc1">QQ:</li>
                             <li class="desc">&nbsp;&nbsp; 917727564</li>
                         </ul>
                     </li>
                     <li>
                         <ul>
                             <li class="desc1">地址：</li>
                             <li class="desc">山东烟台烟台大学</li>
                         </ul>
                     </li>
                     <li>
                         <ul>
                             <li class="desc1">邮箱：</li>
                             <li class="desc">917727564@qq.com</li>
                         </ul>
                     </li>
                     <li>
                         <ul>
                             <li class="desc1"style="margin-right: 18px">个人主页：</li>
                             <li class="desc">917727564@qq.com</li>
                         </ul>
                     </li>
                 </ul>
           </div>
      </div>
       <div class="navbar dh">
           <div class="container ">
                <button data-target="#nav"data-toggle="collapse"class="navbar-toggle">
                    <span class="menu">MENU</span>
                </button>
               <div id="nav"class=" text-center row collapse navbar-collapse "><!--//加按钮折叠样式，和上面配套使用-->
                   <ul class="nav navbar-nav cont">
                       <li class=""><a href="javascript:void(0)"id="ee">Education</a></li>
                       <li class=""><a href="javascript:void(0)"id="ew">Work Experience</a></li>
                       <li class=""><a href="javascript:void(0)"id="ep">My Projects</a></li>
                       <li class=""><a href="#g">Gain Prize</a></li>
                       <li class=""><a href="#m">My Projects</a></li>
                   </ul>
               </div>
           </div>
       </div>
</header>




    <section class="section1 container"id="e">
        <div class="page-header">
        <h1 class="text-center">Education</h1>
        </div>
        <div class="education row">
              <div class="row-md-4 po"style="min-height: 223px">
                  <div class="col-md-6"style="min-height: 223px">
                     <p class="pull-right edu-blue">Master Degree -2010</p>
                  </div>
                  <div class="col-md-6 edu-right"style="min-height: 223px">
                      <span class=" icon glyphicon glyphicon-education text-center "></span>
                      <p class="edu-white">烟台大学</p>
                      <p class="pull-right edu-desc">
                          自从上来烟台大学以后呢，就独得太阳恩宠，我劝太阳一定要雨露均沾，可她就不听，就不听，偏要晒我，晒死我了。
                      </p>
                  </div>
              </div>
              <div class="row-md-4 po"style="min-height: 223px">
                  <div class="col-md-6"style="min-height: 223px">
                      <p class="pull-right edu-center1">清华大学<br/></p>
                      <p class="pull-right edu-desc">自从上来烟台大学以后呢，就独得太阳恩宠，我劝太阳一定要雨露均沾，可她就不听，就不听，偏要晒我，晒死我了。</p>
                  </div>

                  <div class="col-md-6 edu-right"style="min-height: 223px">
                      <span class=" icon glyphicon glyphicon-education text-center "></span>
                      <p class="edu-blue edu-center2">Master Degree -2010</p>
                  </div>
              </div>
              <div class="row-md-4 po"style="min-height: 223px">
                  <div class="col-md-6"style="min-height: 223px">
                      <p class="pull-right edu-blue">Master Degree -2010</p>
                  </div>

                  <div class="col-md-6 edu-right"style="min-height: 223px">
                      <span class="icon glyphicon glyphicon-education text-center "></span>
                      <p class=" text-center edu-white">北京大学</p>
                      <p class="pull-right edu-desc">自从上来烟台大学以后呢，就独得太阳恩宠，我劝太阳一定要雨露均沾，可她就不听，就不听，偏要晒我，晒死我了。</p>
                  </div>
              </div>
        </div>
    </section>

    <section class="section2"id="w">
        <div class="container">
        <div class="page-header">
            <h1 class="text-center">Work Experience</h1>
        </div>
        <div class="row">
            <div class="row-md-4 po"style="min-height: 223px">
                <div class="col-md-6"style="min-height: 223px">
                    <p class="pull-right edu-blue">Master Degree -2010</p>
                </div>
                <div class="col-md-6 edu-right"style="min-height: 223px">
                    <span class=" icon glyphicon glyphicon-education text-center "></span>
                    <p class="edu-white">腾讯</p>
                    <p class="pull-right edu-desc2">自从上来烟台大学以后呢，就独得太阳恩宠，我劝太阳一定要雨露均沾，可她就不听，就不听，偏要晒我，晒死我了。</p>
                </div>
            </div>
            <div class="row-md-4 po"style="min-height: 223px">
                <div class="col-md-6"style="min-height: 223px">
                    <p class="pull-right edu-center1">阿里 <br/></p>
                    <p class="pull-right edu-desc2">自从上来烟台大学以后呢，就独得太阳恩宠，我劝太阳一定要雨露均沾，可她就不听，就不听，偏要晒我，晒死我了。</p>
                </div>

                <div class="col-md-6 edu-right"style="min-height: 223px">
                    <span class=" icon glyphicon glyphicon-education text-center "></span>
                    <p class="edu-blue edu-center2">Master Degree -2010</p>
                </div>
            </div>
        </div>
        </div>
    </section>

     <section class="section3"id="p">
         <div class="container">
          <div class="page-header"><h1 class="text-center">My Projects</h1></div>

             <div class="row shixiantupianfangda">
                 <div class="row-md-6 tjjl size">
                 <div class="col-md-4 size">
                     <a href="http://gc1993.oschina.io/shifeng/html/index.html" class="adddesc">
                         <img src="img/时风.png" alt="时风"class="img-responsive img-rounded picture"/>
                         <div class="projDesc text-center">
                             <span class="page-header span">时时风主页</span>
                             <span style="display: block">时时风官网页面制作</span>
                         </div>
                     </a>
                 </div>
                 <div class="col-md-4 size">
                     <a href="http://gc1993.oschina.io/shifeng/html/index.html" class="adddesc">
                         <img src="img/时风.png" alt="时风"class="img-responsive img-rounded picture"/>
                         <div class="projDesc text-center">
                             <span class="page-header span">时时风销售页面</span>
                             <span style="display: block">时时风官网页面制作</span>
                         </div>
                     </a>
                 </div>
                 <div class="col-md-4 size">
                     <a href="http://gc1993.oschina.io/xiaomi/html/index.html" class="adddesc">
                         <img src="img/小米商城.png" alt="时风"class="img-responsive img-rounded picture"/>
                         <div class="projDesc text-center">
                             <span class="page-header span">小小米商城主页</span>
                             <span style="display: block">关关于小米商城主页的制作</span>
                         </div>
                     </a>
                 </div>
                 </div>
                 <div class="row-md-6 size">
                         <div class="col-md-4 size">
                             <a href="http://gc1993.oschina.io/hbh1/html/index.html"class="adddesc">
                                 <img src="img/海波会.png" alt="时风"class="img-responsive img-rounded picture"/>
                                 <div class="projDesc text-center">
                                     <span class="page-header span">海海博会主页</span>
                                     <span style="display: block">海海博会主页的制作</span>
                                 </div>
                             </a>
                         </div>
                         <div class="col-md-4 size">
                             <a href="http://gc1993.oschina.io/lenovo/html/index.html"class="adddesc">
                                 <img src="img/联想.png" alt=""class="img-responsive img-rounded picture"/>
                                 <div class="projDesc text-center ">
                                     <span class="page-header span">联联想主页</span>
                                     <span style="display: block;">联联想主页的制作</span>
                                 </div>
                             </a>
                         </div>
                         <div class="col-md-4 size">
                             <a href="http://gc1993.oschina.io/tianmao/html/index.html"class="adddesc">
                                 <img src="img/天猫.png" alt="时风"class="img-responsive img-rounded picture"/>
                                 <div class="projDesc text-center">
                                     <span class="page-header span">天天猫主页</span>
                                     <span style="display: block">天天猫主页头部的制作</span>
                                 </div>
                             </a>
                         </div>
                 </div>
             </div>
         </div>
     </section>


    <footer class="navbar-fixed-bottom text-center footer">
        <abbr title="宫晨">gc</abbr>版权所有gc_1993 &copy;2016
    </footer>

<script src="bootstrapfile/js/jquery-3.1.0.min.js"></script>
<script src="bootstrapfile/js/bootstrap.min.js"></script>
<script src="assets/js/jquery-1.8.2.min.js"></script>
<script src="assets/js/supersized.3.2.7.min.js"></script>
<script src="assets/js/supersized-init.js"></script>
<script src="assets/js/scripts.js"></script>
<script src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script type="text/javascript" src="js/BackToTop.jquery.js"></script>
<script>
    /*页面锚链节*/
    $(function () {
        var speed = 800;//滚动速度
        var h=document.body.clientHeight;
        console.log(h);
        var e = document.getElementById("e").offsetTop;
        var w= document.getElementById("w").offsetTop;
        console.log(w);
        //回到底部
        var windowHeight = parseInt($("body").css("height"));//整个页面的高度
        $("#ep").click(function () {
            $('html,body').animate({
                        scrollTop: h+'px'
                    },
                    speed);
        });

        /*去第一部分*/
        $("#ee").click(function () {
            $("body").animate(
                    {
                        scrollTop:e+'px'
                    },
                    speed);
        });
        /*第二部分*/
        $("#ew").click(function () {
            $("body").animate(
                    {
                        scrollTop:w+'px'
                    },
                    speed);
        });

        $( "#gotop").click( function () {
            $( "html,body").animate({ "scrollTop" : 0 }, "slow");
        });
    })

</script>
<script type="text/javascript">

    /*锚链节 回到顶部*/
    $(document).ready(function(){
        BackToTop({
            text : '',
            autoShow : true,
            timeEffect : 800,
            appearMethod : 'slide',
            effectScroll : 'easeOutCubic'
        });
    });
</script>
</body>
</html>